<template>
  <div class="border flex-pack-center">
    <div class="title">
      {{item.title}}
    </div>
    <div class="content">
      {{item.content}}
    </div>
  </div>
</template>

<script>
    export default {
        name: "giftItem",
      data(){
        return{
        }
      },
      props:["item"],
      watch:{
        item(newVal){
        }
      },
    }
</script>

<style scoped>
  .border{
    width: 90%;
    display: flex;
    justify-content: center;
    height: 88px;
    margin-left: 5%;
    border-bottom: 1px solid #09808F;
    flex-direction: column;
  }
  .title{
    font-size: 16px;
    color: #FFFFFF;
    display: flex;
    font-family: PingFang-SC-Semibold;
    align-items: center;
    justify-items: center;
    justify-content: center;
  }
  .content{
    margin-top: 6px;
    color: #FFFFFF;
    font-size: 14px;
    display: flex;
    font-family: PingFang-SC-Regular;
    align-items: center;
    justify-items: center;
    justify-content: center;


  }
  /*居中对齐*/
  .flex-pack-center {
    justify-content: center;
    -webkit-justify-content: center;
  }
</style>
